import React from 'react';
import { useNavigate } from 'react-router-dom';
import { Container } from '@/components/common/container';
import { Toolbar, ToolbarActions, ToolbarHeading } from '@/layouts/demo1/components/toolbar';
import { Button } from '@/components/ui/button';
import { Plus } from 'lucide-react';
import ProjectList from '@/components/project/project-list';

const ProjectListPage = () => {
  const navigate = useNavigate();

  const handleAddProject = () => {
    navigate('/project-management/project-form');
  };

  const handleEditProject = (project) => {
    navigate(`/project-management/project-form/${project.id}`);
  };

  const handleViewProject = (project) => {
    navigate(`/project-management/project-detail/${project.id}`);
  };

  const handleDeleteProject = (project) => {
    if (confirm(`确定要删除项目"${project.project_name}"吗？`)) {
      console.log('删除项目:', project);
      // TODO: 调用删除API
    }
  };

  return (
    <>
      <Container>
        <Toolbar>
          <ToolbarHeading
            title="项目管理"
            description="管理项目信息、进度和团队"
          />
          <ToolbarActions>
            <Button onClick={handleAddProject}>
              <Plus className="size-4 me-2" />
              创建项目
            </Button>
          </ToolbarActions>
        </Toolbar>
      </Container>

      <Container>
        <ProjectList 
          onEdit={handleEditProject}
          onView={handleViewProject}
          onDelete={handleDeleteProject}
        />
      </Container>
    </>
  );
};

export default ProjectListPage; 